@mixin bg($url:'', $width:1px, $height:1px) {
  background-size: cover;
  background-repeat: none;
  background-image: url("../images/"+$url);
  width: $width;
  height: $height;
}

@function r($px, $isFixed:true) {
  @if $px != 0 {
    @return $px/100 +rem;
  } 
  @else
  {
    @return 0;
  }
}

/**
  首页图标
*/ 
.index {
  &-lipei {
    @include bg($url: "lipei.png", $width:r(46), $height:r(44));
  }
  &-record {
    @include bg($url: "record.png", $width:r(52), $height:r(46));
  }
  &-family {
    @include bg($url: "family.png", $width:r(56), $height:r(42));
  }
  &-cart {
    @include bg($url: "cart.png", $width:r(54), $height:r(50));
  }
  &-hat {
    @include bg($url: "hat.png", $width:r(60), $height:r(42));
  }
  &-chat {
    @include bg($url: "chat.png", $width:r(50), $height:r(44));
  }
  &-heart {
    @include bg($url: "heart.png", $width:r(50), $height:r(42));
  }
  &-user {
    @include bg($url: "user.png", $width:r(48), $height:r(46));
  }
  &-empty {
    @include bg($url: "empty.png", $width:r(92), $height:r(104));
  }
  &-name{
    @include bg($url: "user-grey.png", $width:r(30), $height:r(30));
  }
  &-date{
    @include bg($url: "calendar.png", $width:r(28), $height:r(26));
  }
  &-guard{
    @include bg($url: "guard-grey.png", $width:r(28), $height:r(30));
  }
}

.personal{
  &-idcard{
    @include bg($url: "card.png", $width:r(48), $height:r(36));
  }
  &-phone{
    @include bg($url: "phone.png", $width:r(38), $height:r(48));
  }
}

.contact{
  &-ecg{
    @include bg($url: "ecg.png", $width:r(42), $height:r(44));
  }
  &-guard{
    @include bg($url: "guard.png", $width:r(46), $height:r(50));
  }
  &-money{
    @include bg($url: "money.png", $width:r(54), $height:r(50));
  }
  &-tel{
    @include bg($url: "money.png", $width:r(56), $height:r(56));
  }
  &-wechat{
    @include bg($url: "wechat.png", $width:r(76), $height:r(62));
  }
}


.msg{
  @include bg($url: "msg.png", $width:r(238), $height:r(93));
}

.mascot-b{
  @include bg($url: "mascot_b.png", $width:r(75), $height:r(126));
}